<template>
  <el-form :model="conditionForm" class="demo-form-inline">
    <el-row type="flex" align="middle" justify="left">
      <el-col :span="6">
        <el-form-item label="组织代码:">
          <el-input v-model="conditionForm.org" placeholder="组织代码" clearable size="medium" class="inputNormal" />
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="操作类型:">
          <el-input v-model="conditionForm.transactionType" placeholder="操作类型" clearable size="medium"
            class="inputNormal" />
        </el-form-item></el-col>
      <el-col :span="12">
        <el-form-item label="事务处理时间:">
          <el-date-picker v-model="conditionForm.dateTimes" type="daterange" range-separator="至" start-placeholder="开始时间"
            end-placeholder="结束时间" format="yyyy-MM-dd" size="medium" />
          <el-button type="primary" @click="onSubmit" size="medium" class="queryButton">查询</el-button>
        </el-form-item>
        <!-- <el-form-item>

        </el-form-item> -->
      </el-col>
      <!-- <el-col :span="2">
        </el-col> -->


    </el-row>
  </el-form>
</template>

<script lang="ts" setup>
import { reactive } from 'vue';

export interface SelectCondition {
  transactionType?: string;
  org?: string;
  dateTimes: Array<string>;
}

const conditionForm = reactive({
  transactionType: '',
  org: '',
  dateTimes: []
})
const onSubmit = () => {
  emit('setCondition', conditionForm);
}

const emit = defineEmits(['setCondition'])
</script>
<style lang="scss" scoped>
/**

*/
.demo-form-inline .el-input {
  --el-input-width: 220px;
}

.inputNormal {
  width: 180px;
}

.queryButton {
  margin-left: 10px;
}
</style>
